<!DOCTYPE html><!--HTML5 doctype-->
<html>
<head>
<title>Your New Application</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8"> 
<style type="text/css">
    /* Prevent copy paste for all elements except text fields */
    *  { -webkit-user-select:none; -webkit-tap-highlight-color:rgba(255, 255, 255, 0); }
    input, textarea  { -webkit-user-select:text; }
    
    /* Set up the page with a default background image */
    body {
        background-color:#fff;
        color:#000;
        font-family:Arial;
        font-size:36pt;
        margin:0px;padding:0px;
        background-image:url('images/background.jpg');

    }

    input[type=text], input[type=email], input[type=password] {
        font-size:24pt;
    } 

    button {
        font-size: 56px;
    }
</style>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script> 
<script type="text/javascript" charset="utf-8" src="_appMobi/appmobi_local_bootstrap.js"></script> 
<script type="text/javascript" charset="utf-8" src="http://localhost:58888/_appMobi/xhr.js"></script> 

<script type="text/javascript">
    $(document).ready(function(){
        $('#submit').click(function(){
            var email = $('#email').val();
            var varData = 'email=' + email + '&userID=' + sessionStorage.userID;
            console.log(varData);
            var pattern =/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
            if(pattern.test(email)){
                $.ajax({
                    type: "POST",
                    url: "http://localhost:8000/Uni/Project/Emailtest/changeEmail.php",
                    data: varData,
                    success: function(data){
                        //alert("complete userID=" + sessionStorage.userID);
                        $("h1").before(data);
                    }
                });
            }
            
        });
    });

</script>

</head>
    <body>
        <h1>Change Email</h1>
        <form>
            <input type="text" name="email" id="email" />
            <label for="email">Current Email</label>
            <br>
        </form>
        <button id="submit">Change Email</button>
        <div id="test"></div><a href="index.html">back</a>
    </body>
</html>
